$themes: map-merge(
    $themes,
    (
        sd:
            map-merge(
                $theme-defaults,
                map-merge(
                    $light-colors,
                    (
                        background-color: #002b36,
                        medium-color: #93a1a1,
                        text-color: #839496,
                        action-color: #859900,
                        error-color: #dc322f,
                        mute-percent: 60%,
                        color-lightness-shift: 50%
                    )
                )
            )
    )
);

body.th-sd {
    --selected-item-text-color: #002b36;

    /*!
        Markdown Viewer
    */

    --md-title-color: #4d4d4d;
    --md-icon-color: #718908;
    --md-text-color: #cfcfcf;
    --md-header-border: 1px dashed #585858;
    --md-header-title-align: right;
    --md-header-return-align: right;

    --md-h1-color: #97a45f;
    --md-h2-color: #178eac;
    --md-h3-color: #178eac;
    --md-h4-color: #178eac;
    --md-h5-color: #216677;
    --md-h6-color: #216677;
    --md-h1-text-transform: normal;
    --md-h2-text-transform: normal;
    --md-h3-text-transform: normal;
    --md-h4-text-transform: normal;
    --md-h5-text-transform: uppercase;
    --md-h6-text-transform: uppercase;
    --md-h1-text-weight: normal;
    --md-h2-text-weight: normal;
    --md-h3-text-weight: normal;
    --md-h4-text-weight: normal;
    --md-h5-text-weight: normal;
    --md-h6-text-weight: normal;

    --md-hx-link-weight: lighter;
    --md-hx-link-align: super;

    --md-link-n-color: #6e70cf;
    --md-link-h-color: #FFFFFF;
    --md-link-decorator-color: #6260c4;

    --md-paragraph-spacing-start: 1;
    --md-paragraph-spacing-end: 2;
    --md-ul-indent: 2;
    --md-ul-spacing-start: 1;
    --md-ul-spacing-end: 1;
    --md-ul-text-weight: lighter;

    --md-accent-em-color: #E0DB92;
    --md-strong-em-color-1: #43D3FF;
    --md-strong-em-color-2: #BAAAFF;
    --md-accent-strong-color: #FF7190;
    --md-accent-abbr-color: #c2c2c2;
    --md-accent-abbr-line-color: #6260c4;
    --md-accent-strike-text-color: rgba(255, 255, 255, 0.3);
    --md-accent-strike-line-color: rgba(255, 255, 255, 1);

    --md-code-block-text-color: #dbdbdb;
    --md-code-block-text-weight: bold;
    --md-code-block-accent-style: 6px solid #dc322f;;
    --md-code-inline-text-color: #599F56;
    --md-code-inline-text-weight: bolder;
    --md-code-bg-color: #0d3c48;

    --md-table-head-bg-color: #074f61;
    --md-table-body-bg-color: #001b22;
    --md-table-head-text-color: #FFFFFF;
    --md-table-inline-codeblock-bg-color: hsla(var(--md-hue), 100%, 100%, 0.15);
    --md-table-body-left-color: hsla(var(--md-hue), 0%, 0%, 0.45);
    --md-table-text-left-color: #979797;
    --md-table-text-right-color: #979797;
    --md-table-border-rows-color: hsla(var(--md-hue), 15%, 95%, 0.12);
    --md-table-border-outside-color: #222222;

    --md-blockquote-text-color: #cfcfcf;
    --md-blockquote-text-style: italic;
    --md-blockquote-body-bg-color: #9191911c;
    --md-blockquote-accent-color: #DD1862;
    --md-blockquote-inline-codeblock-bg-color: hsla(var(--md-hue), 0%, 10%, 0.70);

    --md-hr-color-1: #84143B;
    --md-hr-color-4: #4F7782;
    --md-hr-color-2: #57A2B5;
    --md-hr-color-3: #CF2460;

    --md-alert-note-color: #539bf5;
    --md-alert-tip-color: #57ab5a;
    --md-alert-important-color: #986ee2;
    --md-alert-warning-color: #c69026;
    --md-alert-caution-color: #e5534b;
    --md-alert-bg-color: #043946;
    --md-alert-border-style: 4px solid #444c56;;

    --md-checkbox-bg-unchecked-color: #001f27;
    --md-checkbox-border-unchecked-color: #4e4e4e;
    --md-checkbox-bg-checked-color: #dc322f;
    --md-checkbox-bg-hover-color: #449b4b;
    --md-checkbox-border-hover-color: #FFFFFF;

    --md-footnote-opacity-full: 1;
    --md-footnote-opacity-min: 0.4;

    /*!
        General
    */

    .list__item--active .blue-color {
        color: #0249bd;
    }

    /*!
        Syntax Highlighting

        These colors are taken from highlight.js.

        to change the theme or create your own theme, you can find the highlighter themes at:
            https://github.com/highlightjs/highlight.js/tree/main/src/styles

        Theme Viewer:
            https://highlightjs.org/demo

        @theme  : tokyo-night-dark.css
    */

    pre code.hljs {
        display: block;
        overflow-x: auto;
        padding: 1em
    }

    code.hljs {
        padding: 3px 5px
    }

    /*  Comment */
    .hljs-meta,
    .hljs-comment {
        color: #565f89
    }

    /* Red */
    /*INFO: This keyword, HTML elements, Regex group symbol, CSS units, Terminal Red */
    .hljs-tag,
    .hljs-doctag,
    .hljs-selector-id,
    .hljs-selector-class,
    .hljs-regexp,
    .hljs-template-tag,
    .hljs-selector-pseudo,
    .hljs-selector-attr,
    .hljs-variable.language_,
    .hljs-deletion {
        color: #f7768e
    }

    /*Orange */
    /*INFO: Number and Boolean constants, Language support constants */
    .hljs-variable,
    .hljs-template-variable,
    .hljs-number,
    .hljs-literal,
    .hljs-type,
    .hljs-params,
    .hljs-link {
        color: #ff9e64
    }

    /*  Yellow */
    /* INFO:  	Function parameters, Regex character sets, Terminal Yellow */
    .hljs-built_in,
    .hljs-attribute {
        color: #e0af68
    }

    /* cyan */
    /* INFO: Language support functions, CSS HTML elements */
    .hljs-selector-tag {
        color: #2ac3de
    }

    /* light blue */
    /* INFO: Object properties, Regex quantifiers and flags, Markdown headings, Terminal Cyan, Markdown code, Import/export keywords */
    .hljs-keyword,
    .hljs-title.function_,
    .hljs-title,
    .hljs-title.class_,
    .hljs-title.class_.inherited__,
    .hljs-subst,
    .hljs-property {
        color: #7dcfff
    }

    /*Green*/
    /* INFO: Object literal keys, Markdown links, Terminal Green */
    .hljs-selector-tag {
        color: #73daca
    }

    /*Green(er) */
    /* INFO: Strings, CSS class names */
    .hljs-quote,
    .hljs-string,
    .hljs-symbol,
    .hljs-bullet,
    .hljs-addition {
        color: #9ece6a
    }

    /* Blue */
    /* INFO:  	Function names, CSS property names, Terminal Blue */
    .hljs-code,
    .hljs-formula,
    .hljs-section {
        color: #7aa2f7
    }

    /* Magenta */
    /*INFO: Control Keywords, Storage Types, Regex symbols and operators, HTML Attributes, Terminal Magenta */
    .hljs-name,
    .hljs-keyword,
    .hljs-operator,
    .hljs-keyword,
    .hljs-char.escape_,
    .hljs-attr {
        color: #bb9af7
    }

    /* white*/
    /* INFO: Variables, Class names, Terminal White */
    .hljs-punctuation {
        color: #c0caf5
    }

    .hljs {
        background: #1a1b26;
        color: #9aa5ce
    }

    .hljs-emphasis {
        font-style: italic
    }

    .hljs-strong {
        font-weight: bold
    }

}
